<script setup>
import { Aim, Scissor, Avatar, Coordinate } from '@element-plus/icons-vue'

const handleOpen = (key, keyPath) => {
  console.log('handleOpen ', key, keyPath)
}
const handleClose = (key, keyPath) => {
  console.log('handleClose ', key, keyPath)
}
</script>

<template>
  <div>
    <el-menu default-active="1" @open="handleOpen" @close="handleClose">
      <el-sub-menu index="1">
        <template #title>
          <el-icon><Avatar /></el-icon>
          <span>患者风险智能评估</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="1-1">患者画像分析</el-menu-item>
          <el-menu-item index="1-2">患者分层识别</el-menu-item>
          <el-menu-item index="1-3">患者运营旅程分析</el-menu-item>
        </el-menu-item-group>
      </el-sub-menu>
      <el-sub-menu index="2">
        <template #title>
          <el-icon><Scissor /></el-icon>
          <span>手术室效能智能分析</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="2-1">手术室效能统计看板</el-menu-item>
          <el-menu-item index="2-2">手术间共享监控</el-menu-item>
        </el-menu-item-group>
      </el-sub-menu>
      <el-sub-menu index="3">
        <template #title>
          <el-icon><Aim /></el-icon>
          <span>专科智能运营体</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="3-1">人力资源和技术评估</el-menu-item>
          <el-menu-item index="3-2">资源配置及效能审计</el-menu-item>
          <el-menu-item index="3-3">专科兵种分析</el-menu-item>
        </el-menu-item-group>
      </el-sub-menu>
      <el-sub-menu index="4">
        <template #title>
          <el-icon><Coordinate /></el-icon>
          <span>AI运营助手</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="4-1">示例：初始页</el-menu-item>
          <el-menu-item index="4-2">示例：数据查询</el-menu-item>
        </el-menu-item-group>
      </el-sub-menu>
    </el-menu>
  </div>
</template>

<style scoped></style>
